{extend name="Public/content"/}
{block name='content'}
<style>.layui-form-mid{line-height: 10px;}.layui-form-label{padding-top: 12px;}</style>
<div class="layui-col-md6">
    <form class="layui-form modal-form-box" action="__SELF__" data-auto="true" method="post">
        <div class="layui-form-item">
            <label class="layui-form-label label-required">Storage<br/>存储引擎</label>
            <div class="layui-input-block">
                {foreach name='data.storage_name' item='vo' key='k'}
                {if condition="sysconf('storage_type') eq $k"}
                <input type="radio" name="storage_type" value="{$k}" title="{$vo}" checked lay-filter="radio"/>
                {else/}
                <input type="radio" name="storage_type" value="{$k}" title="{$vo}" lay-filter="radio"/>
                {/if}
                {/foreach}
            </div>

            <div class="layui-input-block">
                <div class="layui-form-mid layui-word-aux" data-storage-type="local">
                    文件存储在本地服务器，请确保服务器的 ./Public/upload/ 目录有写入权限
                </div>
                <div class="layui-form-mid layui-word-aux" data-storage-type="qiniu">
                    若还没有七牛云帐号，可<a target="_blank" href="https://portal.qiniu.com/signup?code=3lnfys5hfx9oy">免费申请10G存储</a>，申请成功后添加公开bucket。
                </div>
                <div class="layui-form-mid layui-word-aux" data-storage-type="oss">
                    若还没有OSS存储账号, 可<a target="_blank" href="https://oss.console.aliyun.com">创建阿里云OSS存储</a>，需要配置OSS公开访问及跨域策略。
                </div>
            </div>
        </div>

        <div data-storage-type="local">
            <div class="layui-form-item">
                <label class="layui-form-label">AllowExts<br/>允许类型</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_local_exts" value="{:sysconf('storage_local_exts')}" placeholder="请输入系统文件上传后缀" required title="请输入系统文件上传后缀" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">设置系统允许上传文件的后缀，多个以英文逗号隔开。如：png,jpg,rar,doc</div>
                </div>
            </div>
        </div>

        <div data-storage-type="local">
            <div class="layui-form-item">
                <label class="layui-form-label">FileSize<br/>附件大小</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_local_siez" value="{:sysconf('storage_local_siez')?sysconf('storage_local_siez'):0}" placeholder="请输入系统允许上传文件的大小" required title="请输入系统允许上传文件的大小" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">设置系统允许上传文件的大小，0为不限制，单位M</div>
                </div>
            </div>
        </div>

        <div data-storage-type="qiniu">

            <div class="layui-form-item">
                <label class="layui-form-label label-required">Region<br/>存储区域</label>
                <div class="layui-input-block">
                    {foreach name='data.qiniu_region' item='vo'}
                    {if condition="sysconf('storage_qiniu_region') eq $vo"}
                    <input type="radio" name="storage_qiniu_region" value="{$vo}" title="{$vo}" checked/>
                    {else/}
                    <input type="radio" name="storage_qiniu_region" value="{$vo}" title="{$vo}"/>
                    {/if}
                    {/foreach}
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux" data-storage-type="qiniu">
                        七牛云存储空间所在区域，需要严格对应储存所在区域才能上传文件。
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label label-required">Protocol<br/>访问协议</label>
                <div class="layui-input-block">
                    {foreach name='data.is_https' item='vo'}
                    {if condition="sysconf('storage_qiniu_is_https') eq $vo"}
                    <input type="radio" name="storage_qiniu_is_https" value="{$vo}" title="{$vo}" checked/>
                    {else/}
                    <input type="radio" name="storage_qiniu_is_https" value="{$vo}" title="{$vo}"/>
                    {/if}
                    {/foreach}
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux" data-storage-type="qiniu">
                        七牛云存储访问协议（http、https、auto），其中 https 需要配置证书才能使用，auto 为相对协议自动根据域名切换http与https。
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">Bucket<br/>空间名称</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_qiniu_bucket" value="{:sysconf('storage_qiniu_bucket')}" placeholder="请输入七牛云存储 Bucket (空间名称)" required title="请输入七牛云存储 Bucket (空间名称)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">填写七牛云存储空间名称，如：static</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">Domain<br/>访问域名</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_qiniu_domain" value="{:sysconf('storage_qiniu_domain')}" placeholder="请输入七牛云存储 Domain (访问域名)" required title="请输入七牛云存储 Domain (访问域名)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">填写七牛云存储访问域名，如：static.qiniu.com</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">AccessKey<br/>访问密钥</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_qiniu_access_key" value="{:sysconf('storage_qiniu_access_key')}" placeholder="请输入七牛云 AccessKey (访问密钥)" required title="请输入七牛云 AccessKey (访问密钥)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">可以在 [ 七牛云 > 个人中心 ] 设置并获取到访问密钥。</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">SecretKey<br/>安全密钥</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_qiniu_secret_key" value="{:sysconf('storage_qiniu_secret_key')}" required placeholder="请输入七牛云 SecretKey (安全密钥)" required title="请输入七牛云 SecretKey (安全密钥)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">可以在 [ 七牛云 > 个人中心 ] 设置并获取到安全密钥。</div>
                </div>
            </div>

        </div>

        <div data-storage-type="oss">

            <div class="layui-form-item">
                <label class="layui-form-label label-required">Protocol<br/>访问协议</label>
                <div class="layui-input-block">
                    {foreach name='data.is_https' item='vo'}
                    {if condition="sysconf('storage_oss_is_https') eq $vo"}
                    <input type="radio" name="storage_oss_is_https" value="{$vo}" title="{$vo}" checked/>
                    {else/}
                    <input type="radio" name="storage_oss_is_https" value="{$vo}" title="{$vo}"/>
                    {/if}
                    {/foreach}
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux" data-storage-type="oss">
                        阿里云对象存储访问协议（http、https、auto），其中 https 需要配置证书才能使用，auto 为相对协议自动根据域名切换http与https。
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">Bucket<br/>空间名称</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_oss_bucket" value="{:sysconf('storage_oss_bucket')}" placeholder="请输入OSS Bucket (空间名称)" required title="请输入OSS Bucket (空间名称)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">填写OSS存储空间名称，如：think-admin-oss</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">EndPoint<br/>数据中心</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_oss_endpoint" value="{:sysconf('storage_oss_endpoint')}" placeholder="请输入OSS数据中心访问域名 (访问域名)" required title="请输入OSS数据中心访问域名 (访问域名)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">填写OSS数据中心访问域名，如：oss-cn-shenzhen.aliyuncs.com</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">Domain<br/>访问域名</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_oss_domain" value="{:sysconf('storage_oss_domain')}" placeholder="请输入OSS存储 Domain (访问域名)" required title="请输入OSS存储 Domain (访问域名)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">填写OSS存储外部访问域名，如：think-admin-oss.oss-cn-shenzhen.aliyuncs.com</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">AccessKey<br/>访问密钥</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_oss_keyid" value="{:sysconf('storage_oss_keyid')}" placeholder="请输入OSS AccessKey (访问密钥)" required title="请输入OSS AccessKey (访问密钥)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">可以在 [ 阿里云 > 个人中心 ] 设置并获取到访问密钥。</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">SecretKey<br/>安全密钥</label>
                <div class="layui-input-block">
                    <input type="text" name="storage_oss_secret" value="{:sysconf('storage_oss_secret')}" placeholder="请输入OSS SecretKey (安全密钥)" required title="请输入OSS SecretKey (安全密钥)" class="layui-input">
                </div>
                <div class="layui-input-block">
                    <div class="layui-form-mid layui-word-aux">可以在 [ 阿里云 > 个人中心 ] 设置并获取到安全密钥。</div>
                </div>
            </div>

        </div>

        <div class="layui-form-item text-center">
            <button class="layui-btn" type="submit">保存数据</button>
        </div>
    </form>
</div>
{/block}
{block name='script'}
<script>
    buildForm('{:sysconf("storage_type")}');
    window.form.on('radio(radio)', function(obj) {
        buildForm(obj.value)
        return false;
    });
    // 表单显示编译
    function buildForm(value) {
        var $tips = $("[data-storage-type='" + value + "']");
        $("[data-storage-type]").not($tips.show()).hide();
    }
</script>
{/block}